<template>
	<view style="padding-top: 44px;" class="info">
		<uni-list>
<uni-list-item title="头像"  link class="teshu">
				<template slot="header">
					<image class="slot-image" :src="avatarurl" mode="widthFix"  @click="open('bottom')"></image>
				</template>
			</uni-list-item>
	 <uni-list-item title="昵称"   :rightText="niname"  showArrow></uni-list-item>
	  <uni-list-item title=" 简介"   :rightText="introtext"  showArrow></uni-list-item>
		</uni-list>
		<uni-popup ref="popup" type="bottom" border-radius=" 0 0 10px 10px" :mask-click="false">
			<view class="select" style="border-bottom: 1px solid #d1d1d1;border-radius: 6px 6px 0 0 ; " @click="uploadImage">从手机相册选择</view>
			<view class="select" @click="close">取消</view>
		</uni-popup>
	</view>
</template>

<script>
	import url from "@/config/index.js"
		import { alluser,adduser,userinfo } from '@/request/app.js'
	// import uniPopup from '@/components/uni-popup/uni-popup.vue';
	import {
		useredit
	} from '@/request/app.js'
	export default {
		
		data() { 
			return {
				 id:uni.getStorageSync('id'),
				 avatarurl:this.$store.state.imageurl,
				 niname:this.$store.state.nickname,
				 introtext:this.$store.state.intro,
			};
		},

		mounted() {
			console.log(this.$store.state.nickname)
		},

		methods: {
			close() {
						this.$refs.popup.close()
					},
			open(type) {
				this.type = type
				// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
				this.$refs.popup.open(type)
			},
			gotoinfo(){
			uni.navigateTo({
				url: '/pages/set/component/info' // 注意路径格式  
			});
			},
			ceshitoken() {
				uni.reLaunch({
					url: '/pages/index/index' // 注意路径格式  
				});
				
				this.$store.commit("quit")
				localStorage.removeItem('id')
				uni.removeStorageSync('token')
			},
			getinfo(){
				userinfo(this.id).then((i)=>{
					 this.$store.commit('handleChange', i.data)
				})
			},
			uploadImage() {
			  uni.chooseImage({  
			    count: 1, // 默认为9，设置为1表示只选择一张图片  
			    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有  
			    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有  
			    success: (chooseImageRes) => {  
			      // tempFilePath可以作为img标签的src属性显示图片  
			      const tempFilePaths = chooseImageRes.tempFilePaths;  
			      if (tempFilePaths.length > 0) {  
			        const tempFilePath = tempFilePaths[0];  
			        // 发起网络请求  
			        uni.uploadFile({  
					  header:{"Authorization":uni.getStorageSync('token')},
			          url: `${url.baseUrl}/addshare`, // 仅为示例，替换为你的上传接口  
			          filePath: tempFilePath,  
			          name: 'image', // 后端接收的字段名  
			          formData: {  
			            'id': this.id // 其他表单数据  
			          },  
					  
			          success: (uploadFileRes) => {
						  this.getinfo()
						  this.$refs.popup.close()
			            // 返回数据  
			            console.log('uploadFileRes:', uploadFileRes.data);  
			            // 这里的uploadFileRes.data就是上传接口返回的数据  
			          },  
			          fail: (err) => {  
			            console.error('uploadFile fail:', err);  
			          }  
			        });  
			      }  
			    }  
			  });  
			}  
		},
	};
</script>
<style lang="less">
	.info{
		.select{
			width:100%;
			height: 3.6rem;
			background: #fff;
			    display: flex;
			    align-items: center;
			    justify-content: center;
		}
	}
	.teshu{
		.slot-image{
			width: 3rem;
			height: 3rem;
		}
		
	}
	

</style>